<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
    <head>
        <title>Encrypt The Cloud Popup</title>
        <link type="text/css" href="../lib/jquery/css/smoothness/jquery-ui.css" rel="stylesheet" />
        <style type="text/css">
            .ui-tabs .ui-tabs-hide {
                display: none;
            }
            
            #page {
                width: 30em;
            }
            
			#friends {
				min-w
			}
			
            #friendsTable {
                width: 100%;				
            }
			
			#friendsTable tr {
				-webkit-transition: all 0.4s ease-in-out;
			}			
            
            #friendsTable input[type = text] {
                width: 9em;
            }
			
			#sitesTable tr {
				-webkit-transition: all 0.4s ease-in-out;
			}	
			
			.site {
				width: 19em;
			}
            
            body {
                font-size: 10px;
            }
        </style>
        <script src="../lib/jquery/jquery.min.js" type="text/javascript"></script>
        <script src="../lib/nano.js" type="text/javascript"></script>
        <script src="../lib/jquery/jquery-ui.min.js" type="text/javascript"></script>
		<script src="../js/utils.js" type="text/javascript"></script>
        <script src="popup.js" type="text/javascript"></script>
    </head>
    <body>
        <div id="page">
            <div id="accordion">
            	<h3><a href="#">About Encrypt the Cloud</a></h3>
				<div>
					<p>Visit the local <a target="_blank" href="encrypt-the-cloud-demo.html">Demo Page</a> to get started.
					</p>
					<p>&copy; 2010 Marco Stahl</p>
					<p>Its open sourced at <a target="_blank" href="http://code.google.com/p/javascript-experiments/">http://code.google.com/p/javascript-experiments</a>. Please use the issues tracker there for bug reports or feature requests.</p>					
                </div>
                <h3><a href="#">My Key</a></h3>
                <div>
                    <form action="#">
                        <table>
                            <tr>
                                <td>
                                    <label>
                                        Username:
                                    </label>
                                </td>
                                <td>
                                    <input id="username"/>
                                </td>
                            </tr>
                            <tr>
                                <td>
                                    <label>
                                        Key:
                                    </label>
                                </td>
                                <td>
                                    <input id="key"/>
                                </td>
                            </tr>
                        </table>
                    </form>
                </div><h3><a href="#">Friend's Keys</a></h3>
                <div id="friends">
                    <table id="friendsTable">
                        <thead>
                            <tr>
                                <th>
                                    Name
                                </th>
                                <th>
                                    Key
                                </th>
								<th>
                                </th>
                            </tr>
                        </thead>
                        <tbody>
                        </tbody>
                    </table>
					<button id="addFriendButton">+</button>
                </div>
				<h3><a href="#">Sites</a></h3>
				 <div id="sites">
                    <table id="sitesTable">
                        <thead>
                            <tr>
                                <th>
                                    Site
                                </th>
								<th>
                                </th>
                            </tr>
                        </thead>
                        <tbody>
                        </tbody>
                    </table>
					<button id="addSiteButton">+</button><button id="addCurrentSiteButton">+ Current Site</button>
                </div>
            </div>
            <form action="#">
                <button id="save">
                    Save
                </button>
            </form>
        </div>
    </body>
</html>
